<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <h:head>

        <f:metadata>
            <f:event type="preRenderView" listener="#{u_memberManagedBean.verifyLogin('user')}"/>
        </f:metadata>

        <ui:insert name="header"/>

        <!-- CSS -->
        <h:outputStylesheet library="user/css" name="templatemo_style.css"/>

    </h:head>
    <h:body>

        <h:form id="form" prependId="false" enctype="multipart/form-data">
            <h:panelGroup id="request" layout="block"></h:panelGroup>
            <div id="templatemo_top_bar">

                <div class="rss_contact_section">
                    #{u_memberManagedBean.RefreshFriendRequestList()}
                    <div  class="rss_contact contact_button">
                        <p:commandLink  oncomplete="PF('requestdlg').show()" update=":form:requestdlgid">
                            <span style="color: red">#{u_memberManagedBean.friendRequestList.size()}</span> Request(s)
                        </p:commandLink>  
                    </div>                              
                    <div class="rss_contact rss_button">
                        <h:commandLink id="logout" value="Log Out" 
                                       action="#{u_memberManagedBean.logout('user')}"/>
                    </div> 
                    <p:dialog id="requestdlgid" header="Requests List" widgetVar="requestdlg"
                              resizable="false"  showEffect="clip" hideEffect="fold" modal="true" 
                              appendTo="request" minHeight="300" position="750,60">
                        <p:panelGrid columns="1" style="border-style: hidden !important;">
                                <c:forEach var="m2" items="#{u_memberManagedBean.friendRequestList}">
                                    <p:commandLink action="#{u_memberDetailManagedBean.ViewDetail(m2)}" onclick="PF('requestdlg').hide();">
                                        <p:graphicImage library="user/images/avatar" name="#{u_memberDetailManagedBean.Get_Avatar(m2)}" width="30" 
                                                        height="30"/> ${m2.username}
                                    </p:commandLink>
                                </c:forEach>
                            </p:panelGrid>
                    </p:dialog> 
                </div>    
            </div> <!-- end of top bar -->
            <div id="templatemo_banner_bar_wrapper">

                <div id="templatemo_banner_bar">

                    <h1>
                        <a href="#">Matrimony</a>
                    </h1>

                </div> <!-- end of banner -->

            </div> <!-- end of banner wrapper -->

            <div id="templatemo_menu_wrapper">                
                <div id="templatemo_menu">
                    <ul>
                        <li><a href="../faces/index.xhtml">Index</a></li>
                        <li><a href="../faces/editprofile.xhtml">Profile</a></li>
                        <li>
                            <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/search.xhtml')}"
                                           value="search"/>
                        </li>
                        <li>
                            <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/album.xhtml')}"
                                           value="album"/>
                        </li>
                        <li><a href="../faces/about.xhtml">About</a></li>
                    </ul>
                </div> <!-- end of menu -->

            </div> <!-- end of menu wrapper -->

            <div id="templatemo_content">

                <div id="main_column">

                    <ui:insert name="context"/>

                </div> <!-- end of main column -->
                #{u_memberManagedBean.refreshFriendListCombined()}
                <div id="showFriend" class="side_column_w200">
                    <div class="box">
                        <h3>Friends</h3>
                        <ul class="side_menu">
                            <c:forEach var="friend" items="#{u_memberManagedBean.friendListCombined}">
                                <div class="friend_div">
                                    <p:column>
                                        <p:commandLink action="#{u_memberDetailManagedBean.ViewDetail(friend)}">
                                            <p:graphicImage library="user/images/avatar" width="30" height="30"
                                                            name="#{u_memberDetailManagedBean.Get_Avatar(friend)}"/>
                                        </p:commandLink>
                                    </p:column>

                                    <p:column>
                                        <p:commandLink action="#{u_memberDetailManagedBean.ViewDetail(friend)}">
                                            ${friend.username}
                                        </p:commandLink>
                                    </p:column><br/>
                                </div>
                            </c:forEach>
                        </ul>
                    </div> 
                </div> 
                <!-- end of side column 1 -->

                <div class="side_column_w200">

                    <div class="box">

                        <h3>Search</h3>

                        <p:inputText id="Search_FullName" value="#{u_searchManagedBean.whoFind}"/>
                        <p:watermark for="Search_FullName" value="Enter Nick Name" />

                        <p:commandButton value="Search" styleClass="submitbutton" 
                                         action="#{u_searchManagedBean.search_Nickname()}"/>

                        <div class="cleaner"></div>
                    </div>

                </div> <!-- end of right side column -->

                <div class="cleaner"></div>
            </div> <!-- end of content -->

            <div id="templatemo_footer_wrapper">

                <div id="templatemo_footer">

                    <div class="section_w184">
                        <h4>Services</h4>
                        <ul class="footer_menu_list">
                            <li><a href="../faces/index.xhtml">Index</a></li>
                            <li><a href="../faces/editprofile.xhtml">Profile</a></li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/search.xhtml')}"
                                               value="search"/>
                            </li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/album.xhtml')}"
                                               value="album"/>
                            </li>           
                            <li><a href="../faces/about.xhtml">About</a></li>
                        </ul>
                    </div>

                    <div class="section_w184">
                        <h4>Support</h4>  
                        <ul class="footer_menu_list">
                            <li><a href="../faces/index.xhtml">Index</a></li>
                            <li><a href="../faces/editprofile.xhtml">Profile</a></li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/search.xhtml')}"
                                               value="search"/>
                            </li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/album.xhtml')}"
                                               value="album"/>
                            </li>         
                            <li><a href="../faces/about.xhtml">About</a></li>
                        </ul>
                    </div>

                    <div class="section_w184">
                        <h4>About</h4>

                        <ul class="footer_menu_list">
                            <li><a href="../faces/index.xhtml">Index</a></li>
                            <li><a href="../faces/editprofile.xhtml">Profile</a></li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/search.xhtml')}"
                                               value="search"/>
                            </li>
                            <li>
                                <p:commandLink action="#{u_memberManagedBean.goRedirect('../faces/album.xhtml')}"
                                               value="album"/>
                            </li>
                            <li><a href="../faces/about.xhtml">About</a></li>
                        </ul>
                    </div>

                    <div class="section_w368">
                        <h4>Privacy Policy</h4>
                        <p>Privacy stuffs</p>

                        <div class="margin_bottom_10"></div>


                        <a href="http://validator.w3.org/check?uri=referer"><img style="border:0;width:88px;height:31px" src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" width="88" height="31" vspace="8" border="0" /></a>
                        <a href="http://jigsaw.w3.org/css-validator/check/referer"><img style="border:0;width:88px;height:31px"  src="http://jigsaw.w3.org/css-validator/images/vcss-blue" alt="Valid CSS!" vspace="8" border="0" /></a>

                    </div>

                    <div class="margin_bottom_20"></div>

                    <div class="section_w940">
                        Copyright © 2048 <a href="#">Matrimony inc.</a> | Designed by Siv_Cloud
                    </div>

                    <div class="cleaner"></div>
                </div> <!-- end of footer -->

            </div> <!-- end of footer wrapper -->

        </h:form>
    </h:body>
</html>

